import {inject} from 'vue'
import LiftMenu from "@/components/LeftMenu"
import RightImgCarder from "@/components/RightImgCarder"
import MyHeader from "@/components/MyHeader"
//import axios from "axios";
import {useRoute} from 'vue-router';

export default {
    data() {
        return {
            isLogin: false,
            myBaseURL: inject('$baseURL'),
            page: this.query.page, //Number(1),
            sept: Number(32),
            tag: 'dress',
            tags: Array(String),
            tags_cn: Array(String),
            refresh_carder:1,
            refresh: true,
            teenM: false
        }
    },
    name: 'MyHome',
    components: {
        LiftMenu,
        RightImgCarder,
        MyHeader
    },
    methods: {
        teenMode: function (){
            this.teenM = true
            this.refresh_carder++
        },
        re18Mode: function (){
            this.teenM = false
            this.refresh_carder++
        },
        handleClose: function (tagIndex) {
            console.log("close tagindex:"+tagIndex)
            this.tags.splice(tagIndex,1)  // 删除指定下标元素
            this.tags_cn.splice(tagIndex,tagIndex)
            if(this.tags.length === 0){
                this.$router.push({path: '/TagImgs',query:{page: 1}} )
                this.goBack()
            }
            this.refresh_carder++;

        },
        movePage: function (){
            this.$router.push({path: '/TagImgs',query:{ tag: this.tag, page: this.page}} )
            this.goBack()
        },
        prevPage: function (){
            this.page =  parseInt(-1) + parseInt(this.page)
            this.$router.push({path: '/TagImgs',query:{ tag: this.tag, page: this.page}} )  // "/TagImgs/"+"?tag"+this.tag+"&page"+this.page
            this.goBack()
        },
        nextPage: function (){
            this.page =  parseInt(1) + parseInt(this.page)
            this.$router.push({path: '/TagImgs',query:{ tag: this.tag, page: this.page}} )  // "/TagImgs/"+"?tag"+this.tag+"&page"+this.page
            this.goBack()
        },
        goBack: function() {
            document.documentElement.scrollTop = 0;
        },
        getQueryVariable: function(variable){
            let query = window.location.search.substring(1);
            let vars = query.split("&");
            for (let i=0;i<vars.length;i++) {
                let pair = vars[i].split("=");
                if(pair[0] === variable){return pair[1];}
            }
            return false;
        },
        get_new_tag:function (tag_info){
            //接收到子组件传来的新tag
            console.log("接收到子组件传来的新tag")
            console.log(tag_info[0])
            console.log(tag_info[1])
            this.tags.push(tag_info[0])
            console.log("当前tags：")
            console.log(this.tags)
            this.page = 1;
            this.refresh_carder++;
        },
        select_tag:function (tag_info){
            //接收到子组件传来的新tag
            console.log("接收到子组件传来的tag")
            console.log(tag_info[0])
            console.log(tag_info[1])
            this.tags = new Array()
            this.tags.push(tag_info[0])
            console.log("当前tags：")
            console.log(this.tags)
            this.page = 1; //回到第一页
            this.refresh_carder++;
        },
        gotoSetTag:function (){
            if(this.tags.length === 1){
                let tag = this.tags[0]
                this.$router.push({path: '/SetTag',query:{ tag: tag }})
                this.goBack()
            }
        },
        clearTag:function (){
            this.tags = new Array();
            this.$router.push({path: '/TagImgs'})
            //this.refresh_carder++;
        }
    },
    mounted: function () {   /* mounted 挂载后的执行的函数 */
        console.log("执行父组件的mounted")
    },
    beforeCreate() {
        console.log("执行beforeCreate")
        //this.tags.push(this.query.tag)
    },
    created(){
        console.log("执行Create")
        this.tags = new Array();
        this.tags.push(this.query.tag)

        if(isNaN(this.query.page))
            this.page = 1
        else
            this.page =  this.query.page
        this.tag =   this.query.tag
        console.log(this.tags)
        if(this.tag === undefined )
        {
            this.tags = []
        }
        this.refresh_carder++;
    },
    //监听函数
    watch: {
        '$route' () {
            console.log("执行了watch '$route'监听函数 tags:" + this.tags)
            //this.page = this.getQueryVariable("page")               //this.query.page
            //this.tag = this.getQueryVariable("tag")            //this.query.tag
            //console.log("tag:"+this.tag)
            console.log("page:"+this.page)
            //console.log(this.tags)
            //this.tags = this.tags.push(this.tag);
            // 路由变化后 重构tags
            //this.tags = new Array()
            //this.tags.push(this.tag)
            // 刷新子页面
            //this.refresh_carder++;
        },
        tags(){
            console.log("tags发送改变")
            console.log(this.tags)
            this.refresh_carder++;
        },
        page(){
            if(this.page <= 0){
                this.$message.error('页码不能小于0！');//alert("页码不能小于0！")
            }else {
                console.log("page发送改变")
                console.log(this.page)
                this.refresh_carder++;
            }
        }
    },
    setup(){
        const route = useRoute() //获取到值
        console.log("执行了setup函数")
        let query = route.query;
        let setup_tag = route.query.tag
        //console.log(route.query.tag)
        return {
            query,
            setup_tag
        }
    }
}
